<template>
	<view>
		<!-- 商铺推广师 -->
		<view class="">
			<HMFilterDropdown @newArea="newArea" :newAreaShow="true" placeholder="搜索商铺推广师" :filterData="filterData" @searchFatFn="searchFatFn" :defaultSelected="defaultSelected"
				@confirm="confirm">
			</HMFilterDropdown>
		</view>
		<view class="p-26" v-if="lists.length">
			<block v-for="(item,i) in lists" :key="i">
				<promoter @getId="getId" type="list" :item="item"></promoter>
			</block>
		</view>
		<block v-else>
			<noneList></noneList>
		</block>
		<uv-popup ref="popupShop" round="8" :safeAreaInsetBottom="false" :closeable="true">
			<view class="payBox textC flex_c" style="justify-content: center !important;">
				<view class="font-28 m-b-20">商铺：{{shopItem.name||''}}</view>

				<button type="primary" @click="bindShop">确认绑定</button>
			</view>
		</uv-popup>

		<uv-toast ref="uToast"></uv-toast>
		<uv-load-more :status="loadStatus" />
	</view>
</template>

<script>
	import HMFilterDropdown from "@/uni_modules/HM-filterDropdown/components/HM-filterDropdown/HM-filterDropdown"
	export default {
		data() {
			return {
				lists: [],
				loadShow: true,
				loadStatus: 'loadmore',
				pageNum: 1,
				search: '',
				city: '',
				district: '',
				filterData: [{
					"name": '区域',
					"type": 'hierarchy-column',
					"submenu": [{
							"name": "不限",
							"value": "all"
						},]
				}],
				defaultSelected: [
					[3, 0, 1], //第0个菜单选中 一级菜单的第6项，二级菜单的第0项，三级菜单的第1项
					[2, 0, 1], //第1个菜单选中 一级菜单的第2项，二级菜单的第0项，三级菜单的第1项
					[1], //第2个菜单选中 一级菜单的第1项 一级菜单的第1项
					[
						[0],
						[1, 2, 7],
						[1, 0]
					], //筛选菜单选中 第一个筛选的第0项，第二个筛选的第1,2,7项，第三个筛选的第1,0项
					[
						[0],
						[1],
						[1]
					] //单选菜
				],
				shopItem: {},
				promoter_id: ''
			};
		},
		onReachBottom() {
			// 触底加载
			this.getLists()
		},
		onShow() {
			this.lists = []
			this.loadShow = true,
			this.loadStatus = 'loadmore',
			this.pageNum = 1
			let that = this
			uni.$on('myShop', data => {
				console.log('监听到事件来自返回的参数：', data);
				this.shopItem = data
				// setTimeout(()=>{
				this.$refs.popupShop.open('center');
				// },100)
			})
			uni.getStorage({
				key: 'city',
				success: res => {
					this.city = res.data
					this.filterData[0].name = res.data
					this.getLists()
				},
				fail: err => {
					this.city = ''
					this.getLists()
				}
			})
		},
		onLoad() {
			this.getHomeDetali()
		},
		components: {
			HMFilterDropdown
		},
		methods: {
			getId(id) {
				this.promoter_id = id
			},

			bindShop() {
				// 确认绑定
				this.$api.sendRequest({
					url: '/api/shop/bindpromoter',
					data: {
						id: this.shopItem.id,
						promoter_id: this.promoter_id
					},
					success: res => {
						this.$refs.popupShop.close();

						this.$refs.uToast.show({
							type: 'default',
							message: res.msg,
							duration: 1500
						})
					}
				})
			},
			// 地区确定
			confirm(e) {
				this.lists = []
				this.loadShow = true,
				this.loadStatus = 'loadmore',
				this.pageNum = 1
				if (e.value[0].length && e.index[0][0] != null) {
					// 地区
					this.city = e.value[0][0]
					this.district = e.value[0][1]
				}
				this.getLists()
			},
			searchFatFn(e) {
				this.lists = []
				this.loadShow = true,
				this.loadStatus = 'loadmore',
				this.pageNum = 1
				this.search = e
				this.getLists()
			},
			getLists() {
				if (this.loadShow) {
					this.loadStatus = 'loading'
					this.loadShow = false
				this.$api.sendRequest({
					url: '/api/promoter/lists',
					data: {
						page: this.pageNum,
						search: this.search,
						city: this.city||'all',
						district: this.district || 'all',
						num: 10
					},
					success: res => {
						this.lists.push(...res.data.data)
						if (res.data.data.length < 10) {
							this.loadShow = false
							this.loadStatus = 'nomore'
							return
						}
						this.pageNum++
						this.loadShow = true
						this.$forceUpdate()
					}
				})
				}
			},
			// 根据开通区域的id查下面的区
			getArea(id, i) {
				this.$api.sendRequest({
					url: '/api/index/area',
					data: {
						area_id: id
					},
					success: res => {
						let arrs = this.filterData[0].submenu[i].submenu
						arrs.push({
							name: '不限',
							value: 'all',
						})
						res.data.forEach((item, i) => {
							arrs.push({
								name: item.name,
								value: item.name,
							})
						})
						this.filterData[0].submenu[i].submenu = arrs
					}
				})

			},
			// 配置信息
			getHomeDetali() {
				this.$api.sendRequest({
					url: '/api/index/index',
					success: res => {
						// 获取市+区
						res.data.operatearea.forEach((item, i) => {
							this.filterData[0].submenu.push({
								name: item.city,
								value: item.city,
								submenu: [],
								id:item.id
							})
							// this.getArea(item.id, i+1)
						})
						this.getArea(res.data.operatearea[0].id, 1)
					}
				})
			},
			newArea(id, i) {
				this.getArea(id, i)
			},
		},
	}
</script>

<style lang="scss">
	.payBox {
		width: 426rpx;
		height: 270rpx;
		border-radius: 16rpx;
		background-color: #fff;
		padding: 30rpx 25rpx;
	}
</style>
